﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page language="java" contentType="text/html;charset=utf-8"%>
<%@ include file="/pub/includ.jsp"%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
	body {
		background-color:#333333;
		margin:0;
	}
        .header
        {
            width:600px;
            height:56px;
            position:absolute;
            top:50%;
            left:10px;
            background:#fff url(title.png) no-repeat top left;
        }

        a.back{
            width:256px;
            height:73px;
            position:absolute;
            bottom:15px;
            right:15px;
            background:#fff url(codrops_back.png) no-repeat top left;
        }
        a.dry{
            position:absolute;
            bottom:15px;
            left:15px;
            text-align:left;
            font-size:12px;
            color:#ccc;
            text-transform:uppercase;
            text-decoration:none;
        }
        ul#navigation {
		    position: fixed;
		    margin: 0px;
		    padding: 0px;
		    top: 0px;
		    right: 10px;
		    list-style: none;
		    z-index:999;
		    width:721px;
		}
		ul#navigation li {
		    width: 103px;
		    display:inline;
		    float:left;    
		}
		ul#navigation li a {
		    display: block;
		    float:left;
		    margin-top: -2px;
		    width: 100px;
		    height: 25px;
		    background-color:#E7F2F9;
		    background-repeat:no-repeat;
		    background-position:50% 10px;
		    border:1px solid #BDDCEF;
		    -moz-border-radius:0px 0px 10px 10px;
		    -webkit-border-bottom-right-radius: 10px;
		    -webkit-border-bottom-left-radius: 10px;
		    -khtml-border-bottom-right-radius: 10px;
		    -khtml-border-bottom-left-radius: 10px;
		    text-decoration:none;
		    text-align:center;
		    padding-top:80px;
		    opacity: 0.7;
		    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);  
		}
		ul#navigation li a:hover{
		     background-color:#CAE3F2;
		}
		ul#navigation li a span{
		    letter-spacing:2px;
		    font-size:11px;
		    color:#60ACD8;
		    text-shadow: 0 -1px 1px #fff;      
		}
		ul#navigation .home a{
		    background-image: url(<%=imgPath %>/index/home.png);
		}
		ul#navigation .about a      {
		    background-image: url(<%=imgPath %>/index/id_card.png);
		}
		ul#navigation .search1 a      {
		    background-image: url(<%=imgPath %>/index/search.png);
		}
		ul#navigation .podcasts a      {
		    background-image: url(<%=imgPath %>/index/ipod.png);
		}
		ul#navigation .rssfeed a   {
		    background-image: url(<%=imgPath %>/index/rss.png);
		}
		ul#navigation .photos a     {
		    background-image: url(<%=imgPath %>/index/camera.png);
		}
		ul#navigation .contact a    {
		    background-image: url(<%=imgPath %>/index/mail.png);
		}
</style>
<title></title>
</head>
<body>
    <ul id="navigation">
	  <li class="home"><a onclick="runEffect('zdgldiv');" href="#"><span>站点管理</span></a></li> 
	  <li class="about"><a onclick="runEffect('pdgldiv');" href="#"><span>频道管理</span></a></li> 
	  <li class="search1"><a onclick="runEffect('wzzgldiv');" href="#"><span>文章组管理</span></a></li>
	  <li class="photos"><a onclick="runEffect('wzgldiv');" href="#"><span>文章管理</span></a></li> 
	  <li class="rssfeed"><a onclick="runEffect('kjgldiv');" href="#"><span>框架管理</span></a></li> 
	  <li class="podcasts"><a onclick="runEffect('mbgldiv');" href="#"><span>模板管理</span></a></li>  
	  <li class="contact"><a onclick="runEffect('pfgldiv');" href="#"><span>皮肤管理</span></a></li>  
	</ul>
	<!-- 
    <ul id="navigation">
	  <li class="home"><a onclick="openDialog('zdgldiv','/cms/site');" href="#"><span>站点管理</span></a></li> 
	  <li class="about"><a onclick="openDialog('pdgldiv','/cms/channel');" href="#"><span>频道管理</span></a></li> 
	  <li class="search1"><a onclick="openDialog('wzzgldiv','/cms/artgroup');;" href="#"><span>文章组管理</span></a></li>
	  <li class="photos"><a onclick="openDialog('wzgldiv','/cms/article');;" href="#"><span>文章管理</span></a></li> 
	  <li class="rssfeed"><a onclick="openDialog('kjgldiv','/cms/layout');;" href="#"><span>框架管理</span></a></li> 
	  <li class="podcasts"><a onclick="openDialog('mbgldiv','/cms/template');;" href="#"><span>模板管理</span></a></li>  
	  <li class="contact"><a onclick="openDialog('pfgldiv','/cms/lookfeel');;" href="#"><span>皮肤管理</span></a></li>  
	</ul>
	 -->
	
	<script type="text/javascript">
		
		$(document).ready(
			function()
			{
				var d=300;
                $('#navigation a').each(function(){
                    $(this).stop().animate({
                        'marginTop':'-80px'
                    },d+=150);
                });

                $('#navigation > li').hover(
	                function () {
	                    $('a',$(this)).stop().animate({
	                        'marginTop':'-2px'
	                    },200);
	                },
	                function () {
	                    $('a',$(this)).stop().animate({
	                        'marginTop':'-80px'
	                    },200);
	                }
	            );
				initDialog("zdgldiv","/cms/site");
				initDialog("pdgldiv","/cms/channel");
				initDialog("wzzgldiv","/cms/artgroup");
				initDialog("wzgldiv","/cms/article");
				initDialog("kjgldiv","/cms/layout");
				initDialog("mbgldiv","/cms/template");
				initDialog("pfgldiv","/cms/lookfeel");
			}
			
		);
		function openDialog(id,url){
			$('<div id="'+id+'"><iframe width="100%" src="'+url+'" height="100%"></iframe></div>')
		        .appendTo("body");
			$( "#"+id ).dialog({
				autoOpen: false,
                width: 800,
                height: 600,
				show: "Size",
				hide: "Size"
			});
			$( "#"+id ).dialog( "open" );
		}
		function initDialog(id,url){
			$('<div id="'+id+'"><iframe width="100%" src="'+url+'" height="100%"></iframe></div>')
		        .appendTo("body");
			$( "#"+id ).dialog({
				autoOpen: false,
                width: 800,
                height: 600,
				show: "Size",
				hide: "Size"
			});
		}
		var z=2000;
		function runEffect(id){
			$( "#"+id ).dialog( {zIndex:z} );
			$( "#"+id ).dialog( "open" );
			z = z+2;
		};
	
	</script>
</body>
</html>
